<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>12-复习几个事件</title>
</head>
<body>
  <input type="text" id="txt">
  <script>
    // keydown 键盘按下就会触发，获取不到最新输入的值
    // keyup 键盘按下并抬起来的时候，才会触发，可以获取到最新输入的值
    // change 当内容改变完成时才会触发 完成的标志有两个：1. 失去焦点 2. 回车
    // input 和keyup类似，可以获取最新输入的值，但是一直按下不抬起来仍然触发
    // 1. 获取页面中的标签对象
    const txt = document.getElementById('txt')
    // 2. 给事件源注册事件
    // txt.onkeydown = function () {
    // txt.onkeyup = function () {
    // txt.onchange = function () {
    txt.oninput = function () {
      console.log(this.value)
    }
  </script>
</body>
</html>